<template>
  <el-dialog v-model="showVal" title="下载文件" width="90%" max-width="400px" left>
    <div>
      <div>
        <strong>发送到邮件</strong>
      </div>
      <el-input
        v-model="email"
        style="width: 100%; margin-top: 10px; margin-bottom: 10px"
        placeholder="请输入邮箱地址"
        :prefix-icon="Position"
      />
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="showVal = false">取消</el-button>
        <el-button type="primary" @click="sendEmailFn">发送</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { ref, computed } from "vue";
import { Position } from "@element-plus/icons-vue";
import { sendDocument } from "@/api/index";


const props = defineProps(["show", "dataJson","selectValue"]);

const emit = defineEmits(["update:show"]);

const showVal = computed({
  get: () => props.show,
  set: (val) => {
    emit("update:show", val);
  },
});

const email = ref("")

function blobToFile(blob, fileName) {
  const file = new File([blob], fileName);
  return file;
}
function sendEmailFn() {
  if (!email.value) return ElMessage.warning("请输入邮箱地址")
  let data = new FormData()
  data.append("mail", email.value)
  data.append("file", null)
  data.append("title", "钱大妈办公APP隐私政策")
  data.append("url", props.dataJson['隐私政策'][props.selectValue]['file'])
  
  sendDocument(data).then((res) => {
    console.log(res)
    ElMessage.success("已发送邮件，请注意查收")
    showVal.value = false
  }).catch((err) => {
    ElMessage.error("发送失败")
  });
}
</script>
<style lang="scss">
.el-dialog{
  max-width: 400px !important;
  border-radius: 6px;
  .el-dialog__header,
  .el-dialog__body {
      text-align: left;
  }
}
</style>